<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" href="https://apps.bdimg.com/libs/bootstrap/3.2.0/css/bootstrap.min.css">
		<title></title>
		<style>
			.pic {}
		</style>

	</head>

	<body>
		<h2>创建模态框（Modal）</h2>

		<!-- 按钮触发模态框 -->

		<!-- 测试用点击div-->
		
		
		 
		<div id="pic01" class="pic" style="height: 300px;width: 300px;background-color: chartreuse;">
		</div> 
		
		
		<!-- 模态框（Modal） -->
		<div class="modal fade" id="picModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="myModalLabel">图片修改</h4>
					</div>
					<div class="modal-body"></div>
					<div class="modal-body">

						<form class="form-horizontal" role="form">
							<div class="form-group">
								<label for="firstname" class="col-sm-2 control-label">图片id</label>
								<div class="col-sm-10">
									<label type="label" class="form-control" id="pid" >1</label>
								</div>
							</div>
							<div class="form-group">
								<label for="lastname" class="col-sm-2 control-label">文件输入</label>
								<div class="col-sm-10">
									<input id="picfile" name="picfile" type="file" >
								</div>
							</div>
							</form>
					</div>
					<!--按下 ESC 按钮退出。-->
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						<button id="picupload2"type="button" class="btn btn-primary">提交更改</button> 
					</div>
				</div>
				<!-- /.modal-content -->
			</div>
			<!-- /.modal -->
		</div>

	







		<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
		<!-- 可选: 合并了 Bootstrap JavaScript 插件 -->
		<script src="https://apps.bdimg.com/libs/bootstrap/3.2.0/js/bootstrap.min.js"></script>
	</body>

	<script>
		$(function() {
			//			alert("ok");
			$(".pic").attr("data-toggle", "modal");
			$(".pic").attr("data-target", "#picModal");
			
		});
		function getpicup() {
		    var formData = new FormData();
 		   
		   	var pid = $('#pid').text();
		    var file = $("#picfile").get(0).files[0]; 
		   	formData.append("yid", "0a0a0");
		   	formData.append("pid", pid);
		    formData.append("file", file);
		    return formData;
		}
	

		$("#picupload2").on("click",function(){
			var formData=getpicup(); 
		    $.ajax({
		         type:'post',
		         url:'image/imgFile',
		         data: formData,
		         processData:false,//*
		         contentType:false,//*
		         success:function(data){
		             console.log(data);
		         }
		      })	
   	 })
   	 
   	 
   	 
	</script>

</html>